<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<%@page import="com.pengtu.gsj.utils.UserUtils"%>
<script src="${ctx}/scripts/appconfig.jsp" charset="utf-8"></script>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>公路地图</title>
<link rel="stylesheet" href="${ctx}/js/openlayers/ol.css" type="text/css"/>
<link rel="stylesheet" href="${ctx}/static/bootstrap-3.3.7/css/bootstrap.css">
<link rel="stylesheet" href="${ctx}/styles/giscss/gsjgis.css">
<link rel="stylesheet" href="${ctx}/styles/animate.min.css">
<link rel="stylesheet" href="${ctx}/styles/controls.css">
<link rel="shortcut icon" href="${ctx}/images/logo.ico" type="image/x-icon" />
<script type="text/javascript" src="${ctx}/js/jquery-1.7.2.min.js"></script>
<style>
.top{position:fixed !important;top:0;left:0;}
.jbox-button-panel{
	display:none;
}
#jbox-content{
	width:800px;
}
.jbox-title-panel{
	height:40px !important;
}
</style>
<%
	String roleType = "";
	if(UserUtils.hasXqjRole()){
		roleType = "1";
	} else if(UserUtils.hasSsjRole()) {
		roleType = "2";
	} else if(UserUtils.hasAdminRole()) {
		roleType = "3";
	} else {
		roleType = "4";
	}
	//判定当前用户角色类型
	application.setAttribute("roleType", roleType);
%>
</head>
<%@include file="/common/top.jsp" %>
<input type='hidden' name = 'roleType' id="roleType" value="${roleType }"/>
<sec:authorize ifAnyGranted="ROLE_afgcfirst_editor" >
<input type='hidden' name = 'roleType' id="editor" value="1"/>
</sec:authorize>
<div id="map" class="map">
	 <ul class="tool">
	   <li id="zoom_in" class="glyphicon glyphicon-zoom-in"></li>
	   <li id="zoom_out" class="glyphicon glyphicon-zoom-out"></li>
	   <li id="translation">平移</li>
	   <li id="fullExtent">全图</li>
	 </ul>
	 <div id="location"></div>
	 <div id="scaleLine"></div> 
	 <a class="ssqd" target="_blank"><div class="jpg_ico"></div><div class="jpg_txt">设施清单</div></a>
	 <a id="export-jpg" download="map.jpg"><div class="jpg_ico"></div><div class="jpg_txt">地图导出</div></a>
	 <div id="popup" class="ol-popup">
      <a href="#" id="popup-closer" class="ol-popup-closer"></a>
      <div id="popup-content"></div>
    </div>
</div>
<div id="progress"></div>
<div id="SearchBox"></div>
<div id="ThematicMap"></div>
<div id="Legend">
	<p>图例</p>
	<ul class="ul1">
		<li><div class="li_ico ic6"></div><div class="li_txt">公路收费站</div></li>
		<li><div class="li_ico ic2"></div><div class="li_txt">管理机构</div></li>
		<li><div class="li_ico ic3"></div><div class="li_txt">高速公司单位</div></li>
		<li><div class="li_ico ic4"></div><div class="li_txt">公路养护单位</div></li>
	</ul>
	<ul class="ul2 ul4">
		<li><div class="li_ico ic14"></div><div class="li_txt">行政中心</div></li>
		<li><div class="li_ico ic15"></div><div class="li_txt">路政许可</div></li>
		<li><div class="li_ico ic17"></div><div class="li_txt">连续交通量调查</div></li>
		<li><div class="li_ico ic18"></div><div class="li_txt">间隙交通量调查</div></li>
	</ul>
	<ul class="ul2">
		<li><div class="li_ico ic5"></div><div class="li_txt">超限检测站</div></li>
		<li><div class="li_ico ic16"></div><div class="li_txt">桥梁</div></li>
		<li><div class="li_ico ic8"></div><div class="li_txt">主要桩号</div></li>
	</ul>
	<ul class="ul3">
		<li><div class="li_ico ic9"></div><div class="li_txt">高速</div></li>
		<li><div class="li_ico ic10"></div><div class="li_txt">国道</div></li>
		<li><div class="li_ico ic11"></div><div class="li_txt">省道</div></li>
		<li><div class="li_ico ic12"></div><div class="li_txt">县道</div></li>
		<li><div class="li_ico ic13"></div><div class="li_txt">乡道</div></li>
	</ul>
</div>
<div id="echartsShow">
	<div class="delStatus">
		<div id="delStatus" style="height: 100%"></div>
	</div>
	<div class="currentStatus">
		<div id="currentStatus" style="height: 100%"></div>
	</div>
</div>
<div id="FacilitiesList">
	<div id="content">
		<div class="f_title"><span>设施清单</span><div id="f_colse" title="关闭">×</div></div>
		<iframe></iframe>		
	</div>
</div>
<div id="loading"><div class="ico"></div><div class="txt">加载中...</div></div>
<ul id="zxtLegend">
	<li>优<div class="y"></div></li>
	<li>良<div class="l"></div></li>
	<li>中<div class="z"></div></li>
	<li>次<div class="c"></div></li>
	<li>差<div class="c_"></div></li>
</ul>
<div class="gis_title"></div>
<script>
$(function(){
	$(".ssqd").click(function(){
		Loding("show");
		$("#FacilitiesList #content").css({"width":"1000px","height":"575px","margin":($(window).height()-575)*0.5 +"px auto"});
		$("#FacilitiesList iframe").css({"width":"1000px","height":"540px"});
		$("#FacilitiesList iframe").attr("src","${ctx}/roadBasicInfo/show.do?top=402880f65b8f5473015b8f5ac2dd000d&parentId=402880f65b8f1cea015b8f2502710002");
		$("#FacilitiesList iframe").load(function(){
			setTimeout(function(){Loding("hide");$("#FacilitiesList").css({"top":"0"});},500);
		});
	});
	$("#f_colse").click(function(){$("#FacilitiesList").css({"top":"200%"});});
	
	//柱形图例
	$("#zxtLegend").css({"left":($(window).width()-$("#zxtLegend").width())/2});
});
$(window).resize(function(){
	$("#FacilitiesList #content").css({"margin":($(window).height()-575)*0.5 +"px auto"});
	
	$("#zxtLegend").css({"left":($(window).width()-$("#zxtLegend").width())/2});
	
	$(".gis_title").css({
		"left":($(window).width()-$(".gis_title").width())/2+"px"
	});
});
//show & hide
function Loding(e){document.getElementById('loading').style.display=e=="show"?"block":"none";}
</script>
<link href="${ctxStatic}/jquery-jbox/2.3/Skins/Bootstrap/jbox.css?a" rel="stylesheet" />
<script src="${ctxStatic}/jquery-jbox/2.3/jquery.jBox-2.3.min.js" type="text/javascript"></script>
<script src="${ctxStatic}/jquery-jbox/2.3/i18n/jquery.jBox-zh-CN.min.js" type="text/javascript"></script>
<script type="text/javascript" src="${ctx}/js/openlayers/polyfill.js"></script>
<script type="text/javascript" src="${ctx}/js/openlayers/fetch.js"></script>
<script type="text/javascript" src="${ctx}/scripts/controls/echarts-all-3.js"></script>
<script type="text/javascript" src="${ctx}/scripts/controls/echartsShow.js"></script>
<script type="text/javascript" src="${ctx}/js/cypager.js"></script>
<script type="text/javascript" src="${ctx}/js/openlayers/ol-debug.js"></script>
<script type="text/javascript" src="${ctx}/scripts/gsjgis/gisconfig.js"></script>
<script type="text/javascript" src="${ctx}/scripts/gsjgis/ssgis.js"></script>
<script type="text/javascript" src="${ctx}/scripts/controls/searchbox.js"></script>
<script type="text/javascript" src="${ctx}/scripts/controls/ThematicMap.js"></script>
</html>